import * as React from 'react'
import { connect } from 'react-redux'
import { addTodo, ADD_TODO } from '../action';
import { render } from 'react-dom';

export class AddTodo extends React.Component<{ onAddClick }, null>
{
    input: HTMLInputElement;
    render()
    {
        return (
            <div>
                <input type='text' ref={(input) => { this.input = input; }} />
                <button onClick={(e) => this.handleClick(e)}>
                    Add
        </button>
            </div>
        )
    }
    handleClick(e)
    {
        const text = this.input.value.trim()
        this.props.onAddClick(text)
        this.input.value = ''
    }
}